<!--
 * @Author: zhw 443844039@qq.com
 * @Date: 2025-08-02 19:56:01
 * @LastEditors: zhw 443844039@qq.com
 * @LastEditTime: 2025-08-22 21:48:54
 * @Description: 科研进度
-->
<template>
  <div>
    <div class="header">
      <h3>科研进度</h3>
    </div>
    <div id="researchChart" ref="researchChart" class="chart-container"></div>
  </div>
</template>

<script>
import * as echarts from 'echarts'
import { scientificResearchCountApi } from '@/api/workbench'

export default {
  data() {
    return {
    }
  },
  mounted() {
    this.initChart()
  },
  methods: {
    initChart() {
      const chart = echarts.init(this.$refs.researchChart)
      scientificResearchCountApi().then(res => {
        let ywc = [0, 0, 0, 0, 0]
        let wwc = [0, 0, 0, 0, 0]
        res.data.forEach(item => {
          if (item.researchTypeName == '软件著作权') {
            if (item.statusName == '已完成') {
              ywc[0] = item.count || 0
            }else{
              wwc[0] = item.count || 0
            }
          }
          if (item.researchTypeName == '著作') {
            if (item.statusName == '已完成') {
              ywc[1] = item.count || 0
            }else{
              wwc[1] = item.count || 0
            }
          }
      
          if (item.researchTypeName == '专利') {
            if (item.statusName == '已完成') {
              ywc[2] = item.count || 0
            }else{
              wwc[2] = item.count || 0
            }
          }
          if (item.researchTypeName == '课题') {
            if (item.statusName == '已完成') {
              ywc[3] = item.count || 0
            }else{
              wwc[3] = item.count || 0
            }
          }
          if (item.researchTypeName == '论文') {
            if (item.statusName == '已完成') {
              ywc[4] = item.count || 0
            }else{
              wwc[4] = item.count || 0
            }
          }
        });
        const option = {
          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'shadow'
            }
          },
          legend: {
            y:'bottom',
            data: ['已完成', '进行中'],
          },
          xAxis: {
            type: 'value'
          },
          yAxis: {
            type: 'category',
            data: ['软件著作权', '著作', '专利', '课题', '论文']
          },
          series: [
            {
              name: '已完成',
              type: 'bar',
              stack: 'total',
              barWidth: 30,
              label: {
                show: true
              },
              emphasis: {
                focus: 'series'
              },
              data: ywc,
              itemStyle: {
                color: '#A7DBE2'
              }
            },
            {
              name: '进行中',
              type: 'bar',
              stack: 'total',
              barWidth: 30,
              label: {
                show: true
              },
              emphasis: {
                focus: 'series'
              },
              data: wwc,
              itemStyle: {
                color: '#36A7DA'
              }
            }
          ]
        }
        chart.setOption(option)
      })
    }
  }
}
</script>

<style scoped>
.header {
  margin-bottom: 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid #eee;
}

.header h3 {
  margin: 0;
  font-size: 18px;
  color: #333;
}
.chart-container {
  width: 100%;
  height: 400px;
}
</style>